<template>
    <div>
      <!-- 弹窗 -->
       <button @click="handleDelete">弹窗</button>
    </div>
  </template>
  
  <script setup>
  import { ElMessageBox } from "element-plus";
  
  //触发弹框的方法
  //简单赋值
  const handleDelete= () => {
    ElMessageBox({
          title: 'Confirm to remove? ',
          message: "确定删除吗？",
          autofocus: false,
          showCancelButton: true,
          confirmButtonText: 'Confirm',
          cancelButtonText: 'Cancel',
          distinguishCancelAndClose: true, //区分弹框右上角关闭还是点击按钮取消关闭
          showClose: false, //展示右上角的x关闭按钮
          closeOnClickModal: false,
          closeOnPressEscape: false,
          customClass: 'selfButtonView selfMessageBox',
          confirmButtonClass: 'el-button--primary big_Btn',
          cancelButtonClass: 'el-button--primary is-plain big_Btn',
      }).then(() => {
        
          //点击确认按钮要执行的操作
      }).catch((action) => {
          //action: cancel，close
      })
      
  }
  
  </script>
  
  <style lang="scss" scoped>
  
  </style>